<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Bingo</title>
<script>var ctx = "<%=request.getContextPath()%>"; </script>

<% String scriptPageContext = request.getContextPath(); %>

<link rel="stylesheet" type="text/css" href='<%=scriptPageContext %>/static/styles/bingo/fonts.css?family=Gravitas+One&text=1234567'>

<link rel="stylesheet" type="text/css" href="<%=scriptPageContext %>/static/styles/bingo/flip.css" />
<link rel="stylesheet" type="text/css" href="<%=scriptPageContext %>/static/styles/bingo/slot.css" />

<link rel="stylesheet" type="text/css" href="<%=scriptPageContext %>/static/styles/semantic.css">

<link rel="stylesheet" type="text/css" href="<%=scriptPageContext %>/static/styles/bingo.css">

<script type="text/javascript" src="<%=scriptPageContext %>/static/js/bingo//jquery.min.js"></script>
<script type="text/javascript" src="<%=scriptPageContext %>/static/js/bingo//jquery-ui.min.js"></script>
    
<script type="text/javascript" src="<%=scriptPageContext %>/static/js/bingo/jquery.flip.min.js"></script>
</head>

<body>
<div id="main">

	<div class="sponsorListHolder removableSponsor">
		<div class="sponsor">
			<div class="sponsorFlip sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/adobe.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>15</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor">
			<div class="sponsorFlip sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/canon.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor">
			<div class="sponsorFlip sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/cisco.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/dell.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/digg.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/ea.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/ebay.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/facebook.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/google.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/hp.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/microsoft.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/mysql.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/sony.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/vimeo.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
		<div class="sponsor ">
			<div class="sponsorFlip">
				<img src="<%=scriptPageContext %>/static/img/sponsors/yahoo.png"/>
			</div>
			
			<div class="sponsorData">
				<div class="fancy">
				    <ul class="slot">
				        <li><span>8</span></li>
				    </ul>
				</div>
			</div>
		</div>
    	<div class="clear"></div>
		
		<div style="background-color: #1AB8F3; color: white; display:block;margin-top:20px!important; border-radius:4px!important;font-family:'roboto_condensedbold', sans-serif;cursor:pointer;font-size: 1rem;vertical-align: middle;min-height: 1em;outline: none;border: none;margin: 0em;padding: 0.8em 1.5emtext-transform: uppercase;line-height: 1;font-weight: bold;font-style: normal;text-align: center;text-decoration: none;padding: 0.8em 1.5em;" 
		
		id="playFancy" onclick="beforeStart();">
			JUGAR
		</div>
    </div>
    
    
    <div class="sponsorListHolder">
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot1">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot2">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot3">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot4">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot5">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot6">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot7">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot8">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot9">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot10">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot11">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot12">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot13">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot14">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
		<div class="sponsor fancy realFancy" style="visibility: hidden;">
		    <ul class="slot slot15">
		    	<li><span>15</span></li>
		        <li><span>14</span></li>
		        <li><span>13</span></li>
		        <li><span>12</span></li>
		        <li><span>11</span></li>
		        <li><span>10</span></li>
		        <li><span>9</span></li>
		        <li><span>8</span></li>
		        <li><span>7</span></li>
		        <li><span>6</span></li>
		        <li><span>5</span></li>
		        <li><span>4</span></li>
		        <li><span>3</span></li>
		        <li><span>2</span></li>
				<li><span>1</span></li>    
			</ul>
		</div>
    	<div class="clear"></div>
		<div style="background-color: #1AB8F3; color: white; display:block;margin-top:20px!important; border-radius:4px!important;font-family:'roboto_condensedbold', sans-serif;cursor:pointer;font-size: 1rem;vertical-align: middle;min-height: 1em;outline: none;border: none;margin: 0em;padding: 0.8em 1.5emtext-transform: uppercase;line-height: 1;font-weight: bold;font-style: normal;text-align: center;text-decoration: none;padding: 0.8em 1.5em;" 
		id="resetButton" style="visibility: hidden" onclick="reset();">
			REINICIAR
		</div>
    </div>
</div>

<script type="text/javascript" src="<%=scriptPageContext %>/static/js/bingo/jquery.easing.1.3.js" charset="utf-8"></script>
<script type="text/javascript" src="<%=scriptPageContext %>/static/js/bingo/jquery.jSlots.js" charset="utf-8"></script>
<script type="text/javascript" src="<%=scriptPageContext %>/static/js/bingo/bingo.js" charset="utf-8"></script>
</body>
</html>
